<template>
  <div>
    <div class="crumbs">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item>
          <i class="el-icon-lx-cascades"></i> 商铺转让
        </el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="container">
      <div class="handle-box">
        <!-- <el-button
          type="primary"
          icon="el-icon-delete"
          class="handle-del mr10"
          @click="delAllSelection"
          >批量删除</el-button
        > -->
        <el-input
          v-model="query.contact"
          placeholder="转让联系人"
          class="handle-input mr10"
        ></el-input>
        <el-input
          v-model="query.bind_user"
          placeholder="绑定用户"
          class="handle-input mr10"
        ></el-input>
        <el-select v-model="value" placeholder="员工状态">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
            @click="statusShow(value)"
          >
          </el-option>
        </el-select>&nbsp;
        <el-button type="primary" icon="el-icon-search" @click="handleSearch"
          >搜索</el-button>&nbsp;
        <el-button type="primary" @click="addSearch"
          >添加</el-button>
      </div>
      <el-table
        :data="tableData"
        border
        class="table"
        ref="multipleTable"
        header-cell-class-name="table-header"
        @selection-change="handleSelectionChange"
      >
        <el-table-column
          type="selection"
          width="40"
          align="center"
        ></el-table-column>
        <el-table-column
          property="id"
          label="ID"
          width="50"
          align="center"
        ></el-table-column>
         <el-table-column
          property="customer_id"
          label="父级ID"
          width="50"
          align="center"
        ></el-table-column>
         <el-table-column
          property="region"
          label="转让区域"
          width="50"
          align="center"
        ></el-table-column>
         <el-table-column
          property="type"
          label="商铺类型"
          width="50"
          align="center"
          :formatter="ty"
        ></el-table-column>
         <el-table-column
          property="requirement"
          label="商铺要求"
          width="50"
          align="center"
          :formatter="ri"
        ></el-table-column>
         <el-table-column
          property="title"
          label="信息标题"
          width="50"
          align="center"
        ></el-table-column>
         <el-table-column
          property="is_idle"
          label="可否空转"
          width="50"
          align="center"
          :formatter="sd"
        ></el-table-column>
         <el-table-column
          property="address"
          label="详细地址"
          width="50"
          align="center"
        ></el-table-column>
         <el-table-column
          property="area"
          label="店面面积"
          width="50"
          align="center"
        ></el-table-column>
         <el-table-column
          property="price"
          label="转让价格"
          width="50"
          align="center"
        ></el-table-column>
         <el-table-column
          property="rent"
          label="月租金"
          width="50"
          align="center"
        ></el-table-column>
         <el-table-column
          property="mode"
          label="录入模式"
          width="50"
          align="center"
          :formatter="md"
        ></el-table-column>
         <el-table-column
          property="management"
          label="适合/不适合经营"
          width="50"
          align="center"
          :formatter="mg"
        ></el-table-column>
         <el-table-column
          property="contact"
          label="转让联系人"
          width="50"
          align="center"
        ></el-table-column>
         <el-table-column
          property="telephone"
          label="联系电话"
          width="50"
          align="center"
        ></el-table-column>
         <el-table-column
          property="bind_user"
          label="绑定用户"
          width="50"
          align="center"
        ></el-table-column>
         <el-table-column
          property="is_emergency"
          label="是否急转"
          width="50"
          align="center"
          :formatter="ie"
        ></el-table-column>
         <el-table-column
          property="is_seal"
          label="是否盖章"
          width="50"
          align="center"
          :formatter="is"
        ></el-table-column>
        <el-table-column
          property="is_deal"
          label="是否成交"
          width="55"
          align="center"
          :formatter="il"
        ></el-table-column>
        <el-table-column
          property="sort"
          label="排序"
          width="82"
          align="center"
          :formatter="sr"
        ></el-table-column>
        <el-table-column
          property="click_count"
          label="点击率"
          width="110"
          align="center"
        ></el-table-column>
        <el-table-column
          property="introduce"
          label="详细介绍"
          width="110"
          align="center"
        ></el-table-column>
        <el-table-column
          property="status"
          label="状态"
          width="80"
          align="center"
          :formatter="fgf"
        ></el-table-column>
        <el-table-column
          property="best"
          label="适合经营"
          width="150"
          align="center"
        ></el-table-column>
        <el-table-column
          property="is_show"
          label="是否显示"
          width="150"
          align="center"
          :formatter="iw"
        ></el-table-column>

        <el-table-column
          property="created_date"
          label="发布日期"
        ></el-table-column>
        <el-table-column
          property="modified_date"
          label="更新时间"
        ></el-table-column>
        <el-table-column label="操作" width="200" align="center">
          <template #default="scope">
            <el-button
              type="text"
              icon="el-icon-edit"
              @click="handleEdit(scope.$index, scope.row)"
              >编辑</el-button
            >
            <!-- <el-button
              type="text"
              icon="el-icon-delete"
              class="red"
              @click="handleDelete(scope.$index, scope.row)"
              >删除</el-button
            > -->
            <el-button 
            type="text" 
            icon="el-icon-delete"
            class="red"
            @click="handleDelete(scope.$index, scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <div class="block">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="pageIndex"
          :page-sizes="[2, 4, 6, 8]"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="pageTotal"
        >
        </el-pagination>
      </div>
    </div>

    <!-- 编辑弹出框 -->
    <el-dialog title="编辑" v-model="editVisible">
      <el-form ref="form" :model="form" rules="rules" size="medium" label-width="100px">
        <el-row :gutter="15">
          <el-col :span="11">
            <el-form-item label="客户ID">
              <el-input v-model="form.customer_id"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="求租区域">
              <el-input v-model="form.region"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="商铺类型">
              <el-select v-model="form.type" clearable placeholder="全部">
                <el-option
                    v-for="item in typeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="商铺要求">
              <el-select v-model="form.requirement" clearable placeholder="全部">
                <el-option
                    v-for="item in requirementOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="信息标题">
              <el-input v-model="form.title"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="可否空转">
              <el-select v-model="form.is_idle" clearable placeholder="全部">
                <el-option
                    v-for="item in is_idleOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="详细地址">
              <el-input v-model="form.address"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="店面面积">
              <el-input v-model="form.area"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="转让价格">
              <el-input v-model="form.price"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="月租金">
              <el-input v-model="form.rent"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="录入模式">
              <el-select v-model="form.mode" clearable placeholder="全部">
                <el-option
                    v-for="item in modeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="适合/不适合经营">
              <el-select v-model="form.management" clearable placeholder="全部">
                <el-option
                    v-for="item in managementOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="转让联系人">
              <el-input v-model="form.contact"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="联系电话">
              <el-input v-model="form.telephone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="绑定用户">
              <el-input v-model="form.bind_user"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="是否急转">
              <el-select v-model="form.is_emergency" clearable placeholder="全部">
                <el-option
                    v-for="item in is_emergencyOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="是否盖章">
              <el-select v-model="form.is_seal" clearable placeholder="全部">
                <el-option
                    v-for="item in is_sealOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="是否成交">
              <el-select v-model="form.is_deal" clearable placeholder="全部">
                <el-option
                    v-for="item in is_dealOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="排序">
              <el-select v-model="form.sort" clearable placeholder="全部">
                <el-option
                    v-for="item in sortOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="点击率">
              <el-input v-model="form.click_count"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="详细介绍">
              <el-input v-model="form.introduce"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="状态">
              <el-select v-model="form.status" clearable placeholder="全部">
                <el-option
                    v-for="item in statusOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="适合经营">
              <el-input v-model="form.best"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="是否显示">
              <el-select v-model="form.is_show" clearable placeholder="全部">
                <el-option
                    v-for="item in is_showOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="editVisible = false">取 消</el-button>
          <el-button type="primary" @click="saveEdit">确 定</el-button>
        </span>
      </template>
    </el-dialog>

    <!-- 添加弹出框 -->
    <el-dialog title="添加" v-model="addVisible">
      <el-form ref="addform" :model="addform" rules="rules" size="medium" label-width="100px">
        <el-row :gutter="15">
          <el-col :span="11">
            <el-form-item label="客户ID">
              <el-input v-model="addform.customer_id"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="求租区域">
              <el-input v-model="addform.region"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="商铺类型">
              <el-select v-model="addform.type" clearable placeholder="全部">
                <el-option
                    v-for="item in typeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="商铺要求">
              <el-select v-model="addform.requirement" clearable placeholder="全部">
                <el-option
                    v-for="item in requirementOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="信息标题">
              <el-input v-model="addform.title"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="可否空转">
              <el-select v-model="addform.is_idle" clearable placeholder="全部">
                <el-option
                    v-for="item in is_idleOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="详细地址">
              <el-input v-model="addform.address"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="店面面积">
              <el-input v-model="addform.area"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="转让价格">
              <el-input v-model="addform.price"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="月租金">
              <el-input v-model="addform.rent"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="录入模式">
              <el-select v-model="addform.mode" clearable placeholder="全部">
                <el-option
                    v-for="item in modeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="适合/不适合经营">
              <el-select v-model="addform.management" clearable placeholder="全部">
                <el-option
                    v-for="item in managementOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="转让联系人">
              <el-input v-model="addform.contact"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="联系电话">
              <el-input v-model="addform.telephone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="绑定用户">
              <el-input v-model="addform.bind_user"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="是否急转">
              <el-select v-model="addform.is_emergency" clearable placeholder="全部">
                <el-option
                    v-for="item in is_emergencyOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="是否盖章">
              <el-select v-model="addform.is_seal" clearable placeholder="全部">
                <el-option
                    v-for="item in is_sealOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="是否成交">
              <el-select v-model="addform.is_deal" clearable placeholder="全部">
                <el-option
                    v-for="item in is_dealOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="排序">
              <el-select v-model="addform.sort" clearable placeholder="全部">
                <el-option
                    v-for="item in sortOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="点击率">
              <el-input v-model="addform.click_count"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="详细介绍">
              <el-input v-model="addform.introduce"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="状态">
              <el-select v-model="addform.status" clearable placeholder="全部">
                <el-option
                    v-for="item in statusOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="适合经营">
              <el-input v-model="addform.best"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="是否显示">
              <el-select v-model="addform.is_show" clearable placeholder="全部">
                <el-option
                    v-for="item in is_showOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="addVisible = false">取 消</el-button>
          <el-button type="primary" @click="saveAdd">确 定</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script>
import { delTransfer,updateTransfer,showTransfer,getTransfer,AddTransfer } from "../../api/transfer.js";

export default {
  name: "basetable",
  data() {
    return {
      query: {
        contact: "",
        bind_user: "",
        status: 1,
        pageIndex: 1,
        pageSize: 4,
      },
      options: [
        {
          value: "1",
          label: "在职",
        },
        {
          value: "0",
          label: "离职",
        },
      ],
      tableData: [],
      multipleSelection: [],
      delList: [],
      editVisible: false,
      addVisible: false,
      pageTotal: 0,
      addform:{
        customer_id: "",
        region: "",
        type: "",
        requirement: "",
        title: "",
        is_idle:"",
        address: "",
        area: "",
        price: "",
        rent: "",
        mode: "",
        management: "",
        contact: "",
        telephone: "",
        bind_user: "",
        is_emergency: "",
        is_seal: "",
        is_deal: "",
        sort: "",
        click_count: "",
        introduce: "",
        status: "",
        best: "",
        is_show: "",
      },
      form: {
        customer_id: "",
        region: "",
        type: "",
        requirement: "",
        title: "",
        is_idle: "",
        address: "",
        area: "",
        price: "",
        rent: "",
        mode: "",
        management: "",
        contact: "",
        telephone: "",
        bind_user: "",
        is_emergency: "",
        is_seal: "",
        is_deal: "",
        sort: "",
        click_count: "",
        introduce: "",
        status: "",
        best: "",
        is_show: "",
        created_date: "",
        modified_date: "",
      },
      typeOptions: [{
        "value":1,
        "label":"沿街商铺",
      },{
        "value":2,
        "label":"商场商铺",
      },{
        "value":3,
        "label":"社区商铺",
      }],
      requirementOptions: [{
        "value":1,
        "label":"空装",
      },{
        "value":2,
        "label":"带装修",
      },{
        "value":3,
        "label":"不限",
      }],
      is_idleOptions: [{
        "value":1,
        "label":"是",
      },{
        "value":2,
        "label":"否",
      }],
      modeOptions: [{
        "value":1,
        "label":"前台",
      },{
        "value":2,
        "label":"后台",
      }],
      managementOptions: [{
        "value":1,
        "label":"酒楼餐饮",
      },{
        "value":2,
        "label":"服装鞋包",
      },{
        "value":3,
        "label":"美容美发",
      },{
        "value":4,
        "label":"百货超市",
      },{
        "value":5,
        "label":"娱乐休闲",
      },{
        "value":6,
        "label":"汽修美容",
      },{
        "value":7,
        "label":"生活服务",
      },{
        "value":8,
        "label":"空铺转让",
      }],
      is_emergencyOptions: [{
        "value":1,
        "label":"是",
      },{
        "value":2,
        "label":"否",
      }],
      is_sealOptions: [{
        "value":1,
        "label":"是",
      },{
        "value":2,
        "label":"否",
      }],
      is_dealOptions: [{
        "value":1,
        "label":"是",
      },{
        "value":2,
        "label":"否",
      }],
      sortOptions: [{
        "value":1,
        "label":"正",
      },{
        "value":2,
        "label":"反",
      }],
      statusOptions: [{
        "value":1,
        "label":"在职",
      },{
        "value":2,
        "label":"离职",
      }],
      is_showOptions: [{
        "value":1,
        "label":"是",
      },{
        "value":2,
        "label":"否",
      }],
      data() {
        return {
          options: [],
          value: "",
        };
      },
      idx: -1,
      id: -1,
    };
  },
  created() {
    this.Show();
  },
  methods: {
    ty(row){
      if(row.type == "1") {
        return <span style="color:green">沿街商铺</span>;
      } else if (row.type == "2") {
        return <span style="color:red">商场商铺</span>;
      } else {
        return <span style="color:blue">社区商铺</span>;
      }
    },
    ri(row){
      if(row.requirement == "1") {
        return <span style="color:green">空装</span>;
      } else if (row.requirement == "2"){
        return <span style="color:red">带装修</span>;
      } else {
        return <span style="color:blue">不限</span>;
      }
    },
    sd(row){
      if(row.is_idle == "1"){
        return <span style="color:green">是</span>;
      } else {
        return <span style="color:red">否</span>;
      }
    },
    md(row){
      if(row.mode == "1"){
        return <span style="color:green">前台</span>;
      } else {
        return <span style="color:red">后台</span>;
      }
    },
    mg(row){
      if (row.management == "1"){
        return <span style="color:green">酒楼餐饮</span>;
      } else if (row.management == "2"){
        return <span style="color:red">服装鞋包</span>;
      } else if (row.management == "3"){
        return <span style="color:blue">美容美发</span>;
      } else if (row.management == "4"){
        return <span style="color:pink">百货超市</span>;
      } else if (row.management == "5"){
        return <span style="color:yellow">娱乐休闲</span>;
      } else if (row.management == "6"){
        return <span style="color:purple">汽修美容</span>;
      } else if (row.management == "7"){
        return <span style="color:orange">生活服务</span>;
      } else {
        return <span style="color:brown">空铺转让</span>;
      }
    },
    ie(row){
      if(row.is_emergency == "1"){
        return <span style="color:green">是</span>;
      } else {
        return <span style="color:red">否</span>;
      }
    },
    is(row){
      if(row.is_seal == "1"){
        return <span style="color:green">是</span>;
      } else {
        return <span style="color:red">否</span>;
      }
    },
    il(row){
      if(row.is_deal == "1"){
        return <span style="color:green">是</span>;
      } else {
        return <span style="color:red">否</span>;
      }
    },
    sr(row){
      if(row.sort == "1"){
        return <span style="color:green">正</span>;
      } else {
        return <span style="color:red">反</span>;
      }
    },
    fgf(row) {
      if (row.status == "1") {
        return <span style="color:green">在职</span>;
      } else {
        return <span style="color:red">离职</span>;
      }
    },
    iw(row){
      if(row.is_show == "1"){
        return <span style="color:green">是</span>;
      } else {
        return <span style="color:red">否</span>;
      }
    },
    Show() {
      showTransfer({
        PageSize: this.query.pageSize,
        PageIndex: this.query.pageIndex,
        Contact: this.query.contact,
        bind_user: this.query.bind_user,
        Status: this.query.status,
      }).then((res) => {
        console.log(res.data);
        this.tableData = res.data.pagedData;
        this.pageTotal = res.data.totalCount;
      });
    },

    // 触发搜索按钮
    handleSearch() {
      this.Show();
    },
    //状态显示
    statusShow(value) {
      if (value == 1) {
        this.query.status = 1;
        this.Show();
      } else {
        this.query.status = 0;
        this.Show();
      }
    },
    // 删除操作
    handleDelete(index) {
      // 二次确认删除`
      this.$confirm("确定要删除吗？", "提示", {
        type: "warning",
      })
        .then(() => {
          this.$message.success("删除成功");
          this.tableData.splice(index, 1);
        })
        .catch(() => {});
    },

    //删除操作
    open(row) {
      delTransfer({
        id:row.id
      }).then((res) => {
        console.log(res);
        if (res.data.code == 1) {
          alert("删除成功");
          this.Show();
        } else {
          alert("删除失败");
          this.Show();
        }
      });
    },
    // 多选操作
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    delAllSelection() {
      const length = this.multipleSelection.length;
      let str = "";
      this.delList = this.delList.concat(this.multipleSelection);
      for (let i = 0; i < length; i++) {
        str += this.multipleSelection[i].name + " ";
      }
      this.$message.error(`删除了${str}`);
      this.multipleSelection = [];
    },
    //添加操作
    addSearch(){
      this.addVisible = true;
    },
    //保存添加
    saveAdd(){
      AddTransfer(this.addform).then((res) => {
        if(res.code > 0)
        {
          alert("添加成功");
          this.show;
        }
        else
        {
          alert("添加失败");
        }
      });
      this.addVisible = false;
    },
    // 编辑操作
    handleEdit(index, row) {
      getTransfer({
        id:row.id
      }).then((res) => {
        console.log(res);
        this.form = res.data;
      });
      this.editVisible = true;
    },
    // 保存编辑
    saveEdit() {
      updateTransfer(this.form).then((res) => {
        if (res.code > 0) {
          alert("修改成功");
          this.Show();
        } else {
          alert("修改失败");
        }
      });
      this.editVisible = false;
    },
    // 分页导航
    handleSizeChange(pageSize) {
      this.query.pageSize = pageSize;
      this.Show();
    },
    handleCurrentChange(pageIndex) {
      this.query.pageIndex = pageIndex;
      this.Show();
    },
  },
};
</script>

<style scoped>
.handle-box {
  margin-bottom: 20px;
}

.handle-select {
  width: 120px;
}

.handle-input {
  width: 300px;
  display: inline-block;
}
.table {
  width: 100%;
  font-size: 14px;
}
.red {
  color: #ff0000;
}
.mr10 {
  margin-right: 10px;
}
.table-td-thumb {
  display: block;
  margin: auto;
  width: 40px;
  height: 40px;
}
</style>
